<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <jsp:include page="/WEB-INF/views/include/apestarview/include/apestarCss.jsp"></jsp:include>
    <title>${fns:getConfig('productName')}</title>
    <!-- Tell the browser to be responsive to screen width -->
    <jsp:include page="/WEB-INF/views/include/apestarview/include/apestarJs.jsp"></jsp:include>
    <script async="async">
        $(function () {
            jQuery.browser = {};
            (function () {
                jQuery.browser.msie = false;
                jQuery.browser.version = 0;
                if (navigator.userAgent.match(/MSIE ([0-9]+)\./)) {
                    jQuery.browser.msie = true;
                    jQuery.browser.version = RegExp.$1;
                }
            })();
            var baseUrl = String($.host);

            var oldHtml = "";
            $("#search-ipt").bind('input propertychange', function () {
                var searchContent = $(this).val();
                var menuHtml = $('#menu').html();
                if (isEmpty(oldHtml) || ((!(String(oldHtml) === String(menuHtml)) && (String(menuHtml).length > String(oldHtml).length))))
                    oldHtml = menuHtml;
                if (isNotEmpty(searchContent)) {
                    var searchText = $("#menu > li.treeview span:contains(" + searchContent + ")").text();
                    if (isNotEmpty(searchText)) {
                        var searchObj = $("#menu > li.treeview span:contains(" + searchContent + ")").parent().parent();
                        if (isNotEmpty(searchObj)) {
                            $("#menu").empty().append($(searchObj));
                        } else if (isEmpty(searchContent)) {
                            if (isNotEmpty(oldHtml)) {
                                $('#menu').html(oldHtml);
                            }
                        }
                    }
                } else {
                    if (isNotEmpty(oldHtml)) {
                        $('#menu').html(oldHtml);
                    }
                }
            });
        });

        function iFrameHeight() {
            var ifm = document.getElementById("content");
            var subWeb = document.frames ? document.frames["content"].document : ifm.contentDocument;
            if (ifm != null && subWeb != null) {
                ifm.height = subWeb.body.scrollHeight;
            }
        }

        function isNotEmpty(str) {
            return (str != '' && str != null && str != undefined && str != null && str != NaN) ? true : false;
        }

        function isEmpty(str) {
            return (str == '' || str == null || str == undefined || str == null || str == NaN) ? true : false;
        }

    </script>
</head>
<body class="sidebar-mini ajax-template skin-blue fixed">
<div class="wrapper">
    <header class="main-header">
        <!-- Logo -->
        <a href="#" class="logo">
            <!-- mini logo for sidebar mini 50x50 pixels -->
            <span class="logo-mini"><b>后</b>台</span>
            <!-- logo for regular state and mobile devices -->
            <span class="logo-lg"><b>${fns:getConfig('productName')}</b></span>
        </a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top">
            <!-- Sidebar toggle button-->
            <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
                <span class="sr-only">切换导航</span>
            </a>

            <div class="navbar-custom-menu">
                <ul class="nav navbar-nav">
                    <!-- Messages: style can be found in dropdown.less-->
                    <li class="dropdown user user-menu">
                        <a href="#" class="dropdown-toggle"
                           data-toggle="dropdown">
                            <c:set var="default_img"
                                   value="${ctxStatic}/apestar/img/dimg.png"></c:set>
                            <img src="${ not empty fns:getUser().photo ? (fns:getUser().photo):default_img}"
                                 class="user-image"
                                 alt="User Image">
                            <span class="hidden-xs">${fns:getUser().name}&nbsp;</span>
                        </a>
                        <ul class="dropdown-menu">
                            <!-- User image -->
                            <li class="user-header">
                                <p>
                                    您好, ${fns:getUser().name}&nbsp;
                                    <small><fmt:formatDate value="${fns:getUser().createDate}"
                                                           type="both"
                                                           pattern="yyyy-MM-dd"/> &nbsp;加入
                                    </small>
                                </p>
                            </li>
                            <!-- Menu Body -->
                            <li class="user-body">
                            </li>
                            <!-- Menu Footer-->
                            <li class="user-footer">
                                <div class="pull-left">
                                    <a href="${ctx}/sys/user/info" class="btn btn-default btn-flat"
                                       target="mainFrame">简介</a>
                                </div>
                                <div class="pull-middle">
                                    <a href="${ctx}/sys/user/modifyPwd"
                                       class="btn btn-default btn-flat" target="mainFrame">修改密码</a>
                                </div>
                                <div class="pull-right">
                                    <a href="${ctx}/sys/user/logoutWeb"
                                       class="btn btn-default btn-flat">退出</a>
                                </div>
                            </li>
                        </ul>
                    </li>
                    <!-- Control Sidebar Toggle Button -->
                    <li>
                        <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
                    </li>
                </ul>
            </div>
        </nav>
    </header>
    <!-- Left side column. contains the logo and sidebar -->
    <aside class="main-sidebar">
        <!-- sidebar: style can be found in sidebar.less -->
        <section class="sidebar">
            <!-- Sidebar user panel -->
            <div class="user-panel">
                <div class="pull-left image">
                    <img src="${ not empty fns:getUser().photo ? (fns:getUser().photo):default_img}"
                         class="img-circle" alt="User Image">
                </div>
                <div class="pull-left info">
                    <p>${fns:getUser().name}</p>
                    <a href="#"><i class="fa fa-circle text-success"></i> 在线</a>
                </div>
            </div>
            <!-- search form -->
            <form class="sidebar-form">
                <div class="input-group">
                    <input id="search-ipt" type="text" name="q" class="form-control"
                           placeholder="Search...">
                    <span class="input-group-btn">
                <button type="button" name="search" id="search-btn" class="btn btn-flat"><i
                        class="fa fa-search"></i>
                </button>
              </span>
                </div>
            </form>
            <!-- /.search form -->
            <!-- sidebar menu: : style can be found in sidebar.less -->
            <ul id="menu-search" class="sidebar-menu"></ul>
            <jsp:include page="apestarmenu.jsp"></jsp:include>
        </section>
        <!-- /.sidebar -->
    </aside>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <iframe id="mainFrame" name="mainFrame" src="${ctxStatic}/apestarview/main.jsp"
                style="overflow:visible;" scrolling="yes"
                frameborder="no" width="100%" height="100%"></iframe>
        <!-- /.content -->
    </div>

    <!-- /.content-wrapper -->
    <footer class="main-footer">
        <div class="pull-right hidden-xs">
            <b>Version</b> ${fns:getConfig('version')}
        </div>
        <strong>Copyright &copy;
            2012-${fns:getConfig('copyrightYear')} ${fns:getConfig('productName')} - Powered By <a
                    href="#" target="_blank">APEStar</a></strong>
    </footer>

    <!-- Control Sidebar -->
    <aside class="control-sidebar control-sidebar-dark">
        <!-- Create the tabs -->
        <ul class="nav nav-tabs nav-justified control-sidebar-tabs">
        </ul>
        <!-- Tab panes -->
        <div class="tab-content">
            <!-- Home tab content -->
            <div class="tab-pane" id="control-sidebar-home-tab">
            </div>
            <!-- /.tab-pane -->

            <!-- Settings tab content -->
            <div class="tab-pane" id="control-sidebar-settings-tab">
                <form method="post">
                    <!-- /.form-group -->
                </form>
            </div>
            <!-- /.tab-pane -->
        </div>
    </aside>
    <!-- /.control-sidebar -->
    <!-- Add the sidebar's background. This div must be placed
         immediately after the control sidebar -->
    <div class="control-sidebar-bg"></div>
</div>
<div id="loading" class="loading-panel">
    <div class="box">
        <i class="fa fa-refresh fa-spin"></i>
        <span class="tip">
       正在加载 · · ·    
    </span>
    </div>
</div>
</body>
</html>
